<html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- jQuery -->
    <script type="text/javascript" src="../../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="../../js/jquery-3.3.1.js"></script>

    <!--时间插件-->
    <link rel="stylesheet" href="../../bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css"/>
    <script src="../../bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.min.js"></script>
    <script src="../../bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>

    <!-- Bootstrap -->

    <link href="../../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="../../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

    <style type="text/css">
        th {
            text-align: center;
        }

        td {
            text-align: center;
        }

        .row-margin-top {
            margin-top: 10px;
        }

    </style>
    <script>
        $(function () {
            $.ajax({
                url: "../../schedule/findAll",
                type: "post",
                success: function (studioAll) {
                    // alert(studioAll);
                    var schedule_the = '<tr>\n' +
                        '                        <th>计划编号</th>\n' +
                        '                        <th>电影名称</th>\n' +
                        '                        <th>演出厅名称</th>\n' +
                        '                        <th>开始时间</th>\n' +
                        '                        <th>价格(元)</th>\n' +
                        '                        <th>操作</th>\n' +
                        '                    </tr>';
                    $.each(studioAll, function (ind, ele) {
                        schedule_the += '<tr>\n' +
                            '                        <th>' + ele.scheduleId + '</th>\n' +
                            '                        <th>' + ele.play.playName + '</th>\n' +
                            '                        <th>' + ele.studio.studioName + '</th>\n' +
                            '                        <th>' + ele.startTime + '</th>\n' +
                            '                        <th>' + ele.schedulePrice + ' (元)</th>\n' +
                            '                        <th><button id="edit_btn" onclick="editSchedule(\'' + ele.scheduleId + '\',\'' + ele.play.playName + '\',\'' + ele.studio.studioName + '\',\'' + ele.startTime + '\',\'' + ele.schedulePrice + '\')"><span>编辑</span></button><button id="delete_btn" onclick="deleteSchedule(' + ele.scheduleId + ')"><span>删除</span></button></th>\n' +
                            '                    </tr>';
                    })
                    $("#schedule_the").html(schedule_the);
                },
                dataType: "json"
            })
        })

        function deleteSchedule(scheduleId) {
            if (confirm("确认删除？")) {
                $.ajax({
                    url: "../../schedule/deleteScheduleById",
                    type: "post",
                    data: {"scheduleId": scheduleId},
                    success: function () {
                    },
                    dataType: "json"
                })
            }
        }

        function editSchedule(scheduleId, playName, studioName, startTime, schedulePrice) {
            $.ajax({
                url: "../../schedule/findScheduleById",
                type: "post",
                data: {
                    "scheduleId": scheduleId,
                },
                success: function (schedule) {
                    // alert(schedule);
                    $("body").html('<div >\n' +
                        '    <div class="modal-dialog" role="document">\n' +
                        '        <div class="modal-content">\n' +
                        '            <div class="modal-header">\n' +
                        '                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>\n' +
                        '                <h4 class="modal-title">修改演出计划</h4>\n' +
                        '            </div>\n' +
                        '            <div class="modal-body">\n' +
                        '                <form class="form-horizontal" id="modify_schedule" action="#">\n' +
                        '                    <div class="form-group">\n' +
                        '                        <label class="col-sm-2 control-label">电影名称</label>\n' +
                        '                        <div class="col-sm-4">\n' +
                        '                            <input type="text" class="form-control" id="playName_input"\n' +
                        '                                   value="' + playName + '" name="playName">\n' +
                        '                            <span id="playName_span" class="help-block"></span>\n' +
                        '                        </div>\n' +
                        '                    </div>\n' +
                        '                    <div class="form-group">\n' +
                        '                        <label class="col-sm-2 control-label">影厅名称</label>\n' +
                        '                        <div class="col-sm-4">\n' +
                        '                            <input type="text" class="form-control" id="studioName_input"\n' +
                        '                                   value="' + studioName + '" name="studioName">\n' +
                        '                            <span id="studioName_span" class="help-block"></span>\n' +
                        '                        </div>\n' +
                        '                    </div>\n' +
                        '                    <div class="form-group">\n' +
                        '                        <label class="col-sm-2 control-label">开始时间</label>\n' +
                        '                        <div class="col-sm-8">\n' +
                        '                            <input type="text" class="form-control" id="startTime_input" value="' + startTime + '" name="startTime">\n' +
                        '                            <span id="startTime_span" class="help-block"></span>\n' +
                        '                        </div>\n' +
                        '                    </div>\n' +
                        '                    <div class="form-group">\n' +
                        '                        <label class="col-sm-2 control-label">价格</label>\n' +
                        '                        <div class="col-sm-8">\n' +
                        '                            <input type="text" class="form-control" id="schedulePrice_input" value="' + schedulePrice + '" name="schedulePrice">\n' +
                        '                            <span id="schedulePrice_span" class="help-block"></span>\n' +
                        '                        </div>\n' +
                        '                    </div>\n' +
                        '            <div class="modal-footer">\n' +
                        '                <button id="close_btn" type="button" class="btn btn-default" data-dismiss="modal">关闭</button>\n' +
                        '                <button type="submit" class="btn btn-primary" id="modify_btn">修改</button>\n' +
                        '            </div>\n' +
                        '                </form>\n' +
                        '            </div>\n' +
                        '        </div>\n' +
                        '    </div>\n' +
                        '</div>');

                    $("#close_btn").click(function () {
                        location.href = "schedule.html";
                    });

                    $("#modify_schedule").submit(function () {
                        if (playNameSet() && studioNameSet() && startTimeSet() && schedulePriceSet()) {
                            var playName = modify_schedule.playName_input.value;
                            var studioName = modify_schedule.studioName_input.value;
                            var startTime = modify_schedule.startTime_input.value;
                            var schedulePrice = modify_schedule.schedulePrice_input.value;
                            if (confirm("确认修改？")) {
                                $.ajax({
                                    url: "../../schedule/modifySchedule",
                                    type: "post",
                                    data: {
                                        "scheduleId": scheduleId,
                                        "playName": playName,
                                        "studioName": studioName,
                                        "startTime": startTime,
                                        "schedulePrice": schedulePrice
                                    },
                                    success: function () {
                                    },
                                    dataType: "json"
                                });
                                location.href = "schedule.html";
                            }
                            ;
                        }
                        ;
                        return false;
                    });
                    $("#playName_input").blur(playNameSet);
                    $("#studioName_input").blur(studioNameSet);
                    $("#startTime_input").blur(startTimeSet);
                    $("#schedulePrice_input").blur(schedulePriceSet);
                },
                dataType: "json"
            });
        }

        function addSchedule() {
            var addTemplate = '<div id="schedule_add_Modal" >\n' +
                '    <div class="modal-dialog" role="document">\n' +
                '        <div class="modal-content">\n' +
                '            <div class="modal-header">\n' +
                '                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>\n' +
                '                </button>\n' +
                '                <h4 class="modal-title" id="myModalLabel">添加演出计划</h4>\n' +
                '            </div>\n' +
                '            <div class="modal-body">\n' +
                '                <form class="form-horizontal" id="addSchedule" name="addSchedule">\n' +
                '                    <div class="form-group">\n' +
                '                        <label class="col-sm-2 control-label">电影名称</label>\n' +
                '                        <div class="col-sm-4">\n' +
                '                            <select class="form-control" name="playId" id="addPlayId">\n' +
                '                            </select>\n' +
                '                            <span class="help-block"></span>\n' +
                '                        </div>\n' +
                '                    </div>\n' +
                '                    <div class="form-group">\n' +
                '                        <label class="col-sm-2 control-label">影厅名称</label>\n' +
                '                        <div class="col-sm-4">\n' +
                '                            <select class="form-control" name="studioId" id="addStudioId">\n' +
                '                            </select>\n' +
                '                            <span class="help-block"></span>\n' +
                '                        </div>\n' +
                '                    </div>\n' +
                '                    <div class="form-group">\n' +
                '                        <label class="col-sm-2 control-label">开始时间</label>\n' +
                '                        <div class="col-sm-8">\n' +
                '                            <input type="text" class="form-control" id="startTime_input"\n' +
                '                                   placeholder="yyyy-MM-dd HH:mm:ss" name="startTime">\n' +
                '                            <span class="help-block" id="startTime_span"></span>\n' +
                '                        </div>\n' +
                '                    </div>\n' +
                '                    <div class="form-group">\n' +
                '                        <label class="col-sm-2 control-label">价格</label>\n' +
                '                        <div class="col-sm-8">\n' +
                '                            <input type="text" class="form-control" id="schedulePrice_input"\n' +
                '                                   placeholder="schedulePrice" name="schedulePrice">\n' +
                '                            <span class="help-block" id="schedulePrice_span"></span>\n' +
                '                        </div>\n' +
                '                    </div>\n' +
                '                    <div class="modal-footer">\n' +
                '                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>\n' +
                '                        <button type="submit" class="btn btn-primary" id="schedule_save_btn">保存</button>\n' +
                '                    </div>\n' +
                '                </form>\n' +
                '            </div>\n' +
                '        </div>\n' +
                '    </div>\n' +
                '</div>';
            $("body").html(addTemplate);

            $.ajax({
                url: "../../studio/findAll",
                type: "post",
                success: function (allName) {
                    var addStudioId = '';
                    $.each(allName, function (ind, ele) {
                        addStudioId += '<option value="' + ele.studioName + '">' + ele.studioName + '</option>';
                    })
                    $("#addStudioId").html(addStudioId)
                },
                dataType: "json"
            })

            $.ajax({
                url: "../../play/findAllPlay",
                type: "post",
                success: function (allPlay) {
                    var addPlayId = '';
                    $.each(allPlay, function (ind, ele) {
                        addPlayId += '<option value="' + ele.playName + '">' + ele.playName + '</option>';
                    })
                    $("#addPlayId").html(addPlayId);
                },
                dataType: "json"
            })

            $("#addSchedule").submit(function () {
                if (startTimeSet() && schedulePriceSet()) {
                    if (confirm("确认添加？")) {
                        var PlayName = document.addSchedule.playId.value;
                        var studioName = document.addSchedule.studioId.value;
                        var startTime = document.addSchedule.startTime.value;
                        var schedulePrice = document.addSchedule.schedulePrice.value;
                        $.ajax({
                            url: "../../schedule/addSchedule",
                            type: "post",
                            data: {
                                "PlayName": PlayName,
                                "studioName": studioName,
                                "startTime": startTime,
                                "schedulePrice": schedulePrice
                            },
                            success: function () {
                            },
                            dataType: "json"
                        });
                        location.href = "schedule.html";
                    }
                }
                return false;
            })
            $("#startTime_input").blur(startTimeSet);
            $("#schedulePrice_input").blur(schedulePriceSet);
        }

        function searchSchedule() {
            var playName = $("#select_input").val();
            var reg = /^[ \u4e00-\u9fa50-9A-Za-z]{1,16}$/;
            var flag = reg.test(playName);
            if (flag) {
                $.ajax({
                    url: "../../schedule/searchPlayId",
                    type: "post",
                    data: {"playName": playName},
                    success: function (playId) {
                        if (playId == 0) {
                            alert("暂无您搜索的影片");
                        } else {
                            $.ajax({
                                url: "../../schedule/searchSchedule",
                                type: "post",
                                data: {"playId": playId},
                                success: function (schedule) {
                                    if (schedule) {
                                        var schedule_the = '<tr>\n' +
                                            '                        <th>计划编号</th>\n' +
                                            '                        <th>电影名称</th>\n' +
                                            '                        <th>演出厅名称</th>\n' +
                                            '                        <th>开始时间</th>\n' +
                                            '                        <th>价格(元)</th>\n' +
                                            '                        <th>操作</th>\n' +
                                            '                    </tr>';
                                        schedule_the += '<tr>\n' +
                                            '                        <th>' + schedule.scheduleId + '</th>\n' +
                                            '                        <th>' + playName + '</th>\n' +
                                            '                        <th>' + schedule.studio.studioName + '</th>\n' +
                                            '                        <th>' + schedule.startTime + '</th>\n' +
                                            '                        <th>' + schedule.schedulePrice + ' (元)</th>\n' +
                                            '                        <th><button id="edit_btn" onclick="editSchedule(\'' + schedule.scheduleId + '\',\'' + playName + '\',\'' + schedule.studio.studioName + '\',\'' + schedule.startTime + '\',\'' + schedule.schedulePrice + '\')"><span>编辑</span></button><button id="delete_btn" onclick="deleteSchedule(' + schedule.scheduleId + ')"><span>删除</span></button></th>\n' +
                                            '                    </tr>';
                                        $("#schedule_the").html(schedule_the);
                                    } else {
                                        alert('您搜索的影片暂未排期');
                                    }
                                },
                                dataType: "json"
                            })
                        }
                    },
                    dataType: "json"
                })
            } else {
                alert('电影名称只能为汉字,字母或数字，长度在1-16位');
            }
        }

        function playNameSet() {
            var playNameVal = $("#playName_input").val();
            var reg = /^[ \u4e00-\u9fa50-9A-Za-z]{1,16}$/;
            var flag = reg.test(playNameVal);
            if (flag) {
                $("#playName_input").css("border", "1px solid green");
                $("#playName_span").html('');
            } else {
                $("#playName_input").css("border", "1px solid red");
                $("#playName_span").html('电影名称只能为汉字,字母或数字，长度在1-16位');

            }
            return flag;
        }

        function studioNameSet() {
            var studioNameVal = $("#studioName_input").val();
            var reg = /^[ \u4e00-\u9fa50-9A-Za-z]{1,16}$/;
            var flag = reg.test(studioNameVal);
            if (flag) {
                $("#studioName_input").css("border", "1px solid green");
                $("#studioName_span").html('');
            } else {
                $("#studioName_input").css("border", "1px solid red");
                $("#studioName_span").html('演出厅名称只能为汉字,字母或数字，长度在1-16位');

            }
            return flag;
        }

        function startTimeSet() {
            var startTimeVal = $("#startTime_input").val();
            var regTime = /^(((\d{4})-(0[13578]|1[02])-(0[1-9]|[12]\d|3[01]))|((\d{4})-(0[469]|11)-(0[1-9]|[12]\d|30))|((\d{4})-(02)-(0[1-9]|1\d|2[0-8]))|((\d{2}(0[48]|[2468][048]|[13579][26]))-(02)-(29))|(((0[48]|[2468][048]|[13579][26])00)-(02)-(29))) (([01]\d|2[0-3]):([0-5]\d):([0-5]\d))$/;
            var flag = regTime.test(startTimeVal);
            if (flag) {
                $("#startTime_input").css("border", "1px solid green");
                $("#startTime_span").html('');
            } else {
                $("#startTime_input").css("border", "1px solid red");
                $("#startTime_span").html('时间格式为 yyyy-MM-dd HH:mm:ss');
            }
            return flag;
        }

        function schedulePriceSet() {
            var schedulePriceVal = $("#schedulePrice_input").val();
            var regexPrice = /(^[1-9]\d*$)|(^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$)/;
            var flag = regexPrice.test(schedulePriceVal);
            if (flag) {
                $("#schedulePrice_input").css("border", "1px solid green");
                $("#schedulePrice_span").html('');
            } else {
                $("#schedulePrice_input").css("border", "1px solid red");
                $("#schedulePrice_span").html('价格必须为数字');
            }
            return flag;
        }

    </script>
</head>
<body>

<!-- 修改的模态框 -->
<!-- Modal -->
<div class="modal fade" id="schedule_update_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">修改演出计划</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">电影名称</label>
                        <div class="col-sm-4">
                            <select class="form-control" name="playId" id="updatePlayId">
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">影厅名称</label>
                        <div class="col-sm-4">
                            <select class="form-control" name="studioId" id="updateStudioId">
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">开始时间</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="startTime_update_input"
                                   placeholder="yyyy-MM-dd HH:mm:ss" name="startTime">
                            <span class="help-block"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">价格</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="schedulePrice_update_input"
                                   placeholder="schedulePrice" name="schedulePrice">
                            <span class="help-block"></span>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="schedule_update_btn">修改</button>
            </div>
        </div>
    </div>
</div>

<!--添加演出计划-->
<!-- Modal -->
<div class="modal fade" id="schedule_add_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">添加演出计划</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">电影名称</label>
                        <div class="col-sm-4">
                            <select class="form-control" name="playId" id="addPlayId">
                            </select>
                            <span class="help-block"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">影厅名称</label>
                        <div class="col-sm-4">
                            <select class="form-control" name="studioId" id="addStudioId">
                            </select>
                            <span class="help-block"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">开始时间</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="startTime_add_input"
                                   placeholder="yyyy-MM-dd HH:mm:ss" name="startTime">
                            <span class="help-block"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">价格</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="schedulePrice_add_input"
                                   placeholder="schedulePrice" name="schedulePrice">
                            <span class="help-block"></span>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" id="schedule_save_btn">保存</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>


<!--主体-->
<div class="container-fluid">
    <div class="row row-margin-top">
        <div class="col-md-12">
            <div class="row row-margin-top">
                <div class="col-md-8">
                    <div class="col-md-4">
                        <input type="text" class="form-control" id="select_input" placeholder="请 输 入 电 影 名 称"
                               name="playName">
                        <span class="help-block"></span>
                    </div>
                    <div class="col-md-1">
                        <button id="select_button" onclick="searchSchedule()" class="btn btn-success btn-sm"><span
                                class="glyphicon glyphicon-search" aria-hidden="true"></span>搜索
                        </button>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3 col-md-offset-5">
                    <h1>安排演出</h1>
                </div>
            </div>


            <div class="row row-margin-top">
                <div class="col-md-1 col-md-offset-10">
                    <button id="schedule_add_modal_btn" onclick="addSchedule()" class="btn btn-primary btn-sm"><span
                            class="glyphicon glyphicon-facetime-video" aria-hidden="true"></span>&nbsp;新增
                    </button>
                </div>
            </div>
            <div class="row row-margin-top">
                <table id="schedule_table" class="table table-bordered table-striped">
                    <thead id="schedule_the">
                    <tr>
                        <th>计划编号</th>
                        <th>电影名称</th>
                        <th>演出厅名称</th>
                        <th>开始时间</th>
                        <th>价格(元)</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>

            </div>
        </div>
    </div>

    <div class="row row-margin-top">
        <!-- 分页条信息 -->
        <div id="page_nav" class="col-md-4 col-md-offset-4">
        </div>
    </div>
    <!-- 显示分页信息 -->
    <div class="row row-margin-top">
        <!--分页文字信息  -->
        <div id="page_info" class="col-md-4 col-md-offset-4">
        </div>
    </div>
</div>
</body>
</html>
